<template>
    <div class="popup">
        <van-action-sheet v-model:show="isShow" closeable>
            <div class="pop" v-if="goods">
                <div class="header">
                    <van-image :src="goods.image" />
                    <div class="detail">
                        <span class="title">{{ goods.name }}</span>
                        <span class="price">￥<span class="rmb">{{ goods.price }}</span></span>
                    </div>
                </div>
                <div class="content">
                    <span>购买数量</span>
                    <van-field name="stepper">
                        <template #input>
                            <van-stepper v-model="num" theme="round" button-size="32" />
                        </template>
                    </van-field>
                </div>
                <div class="foot">
                    <van-button type="primary">确定</van-button>
                </div>
            </div>
        </van-action-sheet>
    </div>
</template>
<script setup>
import { onMounted, ref, computed } from 'vue';
import { useRouter } from 'vue-router'
import { showToast } from 'vant';
import axios from '../utils/axios';

const props = defineProps({
    goods: {
        type: Object,
        default: {}
    },
    isShow: {
        type: Boolean,
        default: false
    }
})
const router = useRouter();
const isShow = props.isShow

const goods = computed(() => {
    return props.goods
})

</script>
<style></style>
